<template>
  <!-- 活动剪影 -->
  <div id="newslist">
    <div class="title-img">
      <img src="../../../static/images/icon/basketball.svg" alt="">
        <span>活动剪影</span>
        <span class="more">
          <router-link to="/info">
            <a href="javascript:void(0);"
            :to="{ path: '/info',query:{category:3} }">更多+</a>
          </router-link>
        </span>
    </div>

    <div class="new-tu">
      <el-carousel
        trigger="click"
        :interval="8000"
      >
        <!-- <el-carousel-item
          v-for="(item,n) in newUrl"
          :key="n"
           class="newImg"
        > -->
        <el-carousel-item v-for="item in newUrl" :key="item">
          <img :src="item" alt="" class="newImg">
        </el-carousel-item>
      </el-carousel>
    </div>
    <ul class="news_liebiao">
      <li class="weui-news-item" v-if="index == 0" v-for="(temp,index) in activityList" @click="toDetail(temp)">
        <div class="weui-news-text">
          <div class="weui-news-title"><a href="javascript:void(0);"><span style="color: red">【新】</span>{{temp.title.substring(0,30)+"..."}}</a></div>
        </div>
        <div class="weui-news-date">[{{ temp.createTime }}]</div>
      </li>
      <li class="weui-news-item" v-if="index != 0" v-for="(temp,index) in activityList" @click="toDetail(temp)">
        <div class="weui-news-text">
          <div class="weui-news-title"><a href="javascript:void(0);">{{temp.title.substring(0,30)+"..."}}</a></div>
        </div>
        <div class="weui-news-date">[{{ temp.createTime }}]</div>
      </li>
    </ul>
  </div>
</template>

<script>
import {Carousel} from 'element-ui';
import request from '../../utils/request'
export default {
  name: "HotNotice",
  components:{
    Carousel,
  },
  data() {
    return {
      newUrl: [
          require("../../../static/img/index/growup1.jpg"),
          require("../../../static/img/index/growup2.jpg"),
          require("../../../static/img/index/growup3.jpg"),
          require("../../../static/img/index/growup4.jpg"),
      ],
      //活动列表
      activityList:[],
      url: {
        newsList: '/sunNews/list'
      }
    };
  },
  created() {
    this.getActivityList()
  },
  methods: {
    //跳转新闻详情页面
    toDetail(data){
      this.$router.push("./subjectInfo?id="+data.id)
    },
    //获取活动公告详情
    getActivityList () {
      request.get(this.url.newsList,{
        params:{
          pageSize:5,
          category:3
        }
      })
        .then((res) => {
          if (res.data.success) {
            this.activityList = res.data.result.records
          }
        }).catch((error)=>{
        console.log(error)
      })
    },
  }
};
</script>

<style>
.new-tu .el-carousel__arrow{
  position: absolute;
    top: 24%;
    display: visible !important;
}
</style>
